<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport"
        content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>ʟᴏɢᴊs</title>
  <meta name="title" content="log.js">
  <meta name="keywords" content="One line code solution front-end log.">
  <meta name="description" content="One line code solution front-end log. Web Log collection. React, Vue, Jquery">
  <link rel="stylesheet" href="./index.css">
  <link rel="icon" href="./images/logo.png">
  <link rel="stylesheet" href="./bootstrap.min.css">
  <script src="./bootstrap.min.js"></script>
  <script src="https://logjs.site/version/2.0.1/log.min.js" onload="log.init({ sendAddress: 'https://logjs.site/log-war/log', id: 'logjs-website-quickStart' })"></script>
  <style>
    /*body{*/
    /*    filter: grayscale(1);*/
    /*}*/
    .division{
      display: inline-block;
      margin: 13px 3px;
      height: 20px;
      border: 1px solid #595959;
    }
    .doc{
      margin: 20px;
    }
  </style>
</head>
<body>

<div class="alert alert-warning alert-dismissible fade show" role="alert" style="margin-bottom: 0">
  <strong>chatGPT聊天目前需要token才可以继续</strong> 需要体验请在 <a href="https://gitee.com/clark-fl/log.js/issues/new?issue%5Bassignee_id%5D=0&issue%5Bmilestone_id%5D=0">issues</a> 处提问
  <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
</div>

<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
  <div class="container-fluid">
    <img src="https://logjs.site/images/logo.png" alt="" style="width: 25px; margin: 0 10px;">
    <a class="navbar-brand" href="https://logjs.site/">
      LOGJS
    </a>
    <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
      <span class="navbar-toggler-icon"></span>
    </button>
    <div class="collapse navbar-collapse" id="navbarSupportedContent">
      <ul class="navbar-nav me-auto mb-2 mb-lg-0">
        <li class="nav-item">
          <a class="nav-link" aria-current="page" href="https://logjs.site/">首页</a>
        </li>
        <li class="nav-item">
          <a class="nav-link active" aria-current="page" href="https://logjs.site/quickStart.html" disabled>快速开始</a>
        </li>
        <li class="nav-item">
          <a class="nav-link" aria-current="page" href="https://logjs.site/version/2.0.1/debugTool.html">调试工具</a>
        </li>
      </ul>

      <form class="d-flex" role="search">
        <input class="form-control me-2" type="search" placeholder="通过chatGPT寻找答案" aria-label="Search" id="searchInput">
        <button class="btn btn-outline-success" type="submit" id="searchInputBtn">Search</button>
      </form>

      <ul class="navbar-nav mb-2 mb-lg-0">
        <li class="nav-item">
          <a class="nav-link" aria-current="page" href="https://github.com/fanliang8023/log.js" target="_blank">
            <svg height="32" aria-hidden="true" viewBox="0 0 16 16" version="1.1" width="32" data-view-component="true">
              <path fill="white" fill-rule="evenodd" d="M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z"></path>
            </svg>
          </a>
        </li>
        <li class="division"></li>
        <li class="nav-item">
          <a class="nav-link" aria-current="page" href="https://gitee.com/clark-fl/log.js" target="_blank">
            <img src="https://logjs.site/images/gitee-logo.png" alt="" style="width: 36px;">
          </a>
        </li>
      </ul>
    </div>
  </div>
</nav>

<div class="row doc">
  <div class="col-2">
    <nav id="navbar-example3" class="h-100 flex-column align-items-stretch pe-4 border-end">
      <nav class="nav nav-pills flex-column">
        <a class="nav-link" href="#item-1">在网站中引入log.js</a>
        <nav class="nav nav-pills flex-column">
          <a class="nav-link ms-3 my-1" href="#item-1-1">在传统项目中</a>
          <a class="nav-link ms-3 my-1" href="#item-1-2">在React项目中</a>
        </nav>
        <a class="nav-link" href="#item-2">初始化您的log.js</a>
        <a class="nav-link" href="#item-3">配置您的采集内容</a>
        <nav class="nav nav-pills flex-column">
          <a class="nav-link ms-3 my-1" href="#item-3-1">日志等级</a>
          <a class="nav-link ms-3 my-1" href="#item-3-2">日志将送往哪里</a>
        </nav>
      </nav>
    </nav>
  </div>

  <div class="col-10">
    <div data-bs-spy="scroll" data-bs-target="#navbar-example3" data-bs-smooth-scroll="true" class="scrollspy-example-2" tabindex="0">
      <div id="item-1">
        <h4>在网站中引入log.js</h4>
        <p>...</p>
      </div>
      <div id="item-1-1">
        <h5>在传统项目中</h5>
        <p>...</p>
      </div>
      <div id="item-1-2">
        <h5>在React项目中</h5>
        <p>...</p>
      </div>
      <div id="item-2">
        <h4>Item 2</h4>
        <p>...</p>
      </div>
      <div id="item-3">
        <h4>Item 3</h4>
        <p>...</p>
      </div>
      <div id="item-3-1">
        <h5>Item 3-1</h5>
        <p>...</p>
      </div>
      <div id="item-3-2">
        <h5>Item 3-2</h5>
        <p>...</p>
      </div>
    </div>
  </div>
</div>

</body>
</html>